<template>
	<view>
		<u-sticky bgColor="#fff">
			<view class="bg-gray">
				<view class="flex justify-between">
					<template v-for="col in tableHd">
						<view class="col-item" :style="[col.style]">
							<view class="text-center text-gray font-24">
								{{ col.title }}
							</view>
						</view>
					</template>
				</view>
			</view>

			<!-- <view class="item bg-gray">
				<view class="flex font-24 text-light-gray">
					<view class="flex-1">
						食材
					</view>
					<view style="width: 100upx;">
						数量
					</view>
					<view class="text-center"style="width: 100upx;">
						盈亏
					</view>
					<view class="text-center" style="width: 100upx;" >
						处置
					</view>
					<view class="flex-1" >
						记账日期
					</view>
					<view class="text-center" style="width: 60upx;">
						备注
					</view>
				</view>
			</view> -->
			<u-line></u-line>
		</u-sticky>
		<template v-for="v in list">
			<item :table="tableHd" :detail="v" :days="picker_day" @del="delItem" @updata="updataItem"></item>
		</template>

		<view class="blank90"></view>
		<view class=" bgw fixed-bottom">
			<u-line></u-line>
			<view class="flex">
				<view class="flex-1">

				</view>
				<!-- disabled -->
				<view class="save-btn" @click="save">
					{{id?'盈亏调整':'提交'}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	const _today = new Date();
	let _today_year = _today.getFullYear();
	let _today_month = _today.getMonth() + 1;
	let _today_day = _today.getDate();

	let dayStr = '日一二三四五六';
	let dayArry = [];
	for (let i = 0; i < 4; i++) {
		let date = new Date(_today.getTime() - (24 * 60 * 60 * 1000 * i));
		let _Day = date.getDay();
		let year_month_day = `${date.getFullYear()}` + `-` + `${date.getMonth()+1}`.padStart(2, '0') + `-` + `${date.getDate()}`.padStart(2, '0');
		let week = '周' + dayStr[_Day];
		let text = '';
		switch (i) {
			case 0:
				text = '今天';
				break;
			case 1:
				text = '昨天';
				break;
			case 2:
				text = '前天';
				break;
			case 3:
				text = '大前天';
				break;
			default:
				text = ''
				break;
		}
		let item = {
			text: text,
			label: `${text} [ ${week} ] ( ${year_month_day} )`,
			id:i==0?'0':'-' + i
		}
		dayArry.push(item);
	}

	import {
		one_stock_taking_record_detail,
		stock_taking_record_handle_diff
	} from "@/common/api.js";
	import item from './components/item.vue';
	export default {
		components: {
			item
		},
		data() {
			return {
				picker_day: dayArry,
				id: 0,
				date: '',
				loadingStatus: '',
				list: [],
				tableConfig: {
					_material_id: {
						title: "食材",
						key: "_material_id",
						style: {
							width: "150rpx",
						},
					},
					main_qty: {
						title: "数量",
						key: "main_qty",
						style: {
							width: "140rpx",
						},
					},
					_main_unit_id: {
						title: "单位",
						key: "_main_unit_id",
						style: {
							width: "70rpx",
						},
					},
					profit: {
						title: "盈亏",
						key: "profit",
						style: {
							width: "80rpx",
						},
					},
					status: {
						title: "处置",
						key: "status",
						style: {
							width: "120rpx",
						},
					},
					stock_out_per_taking_cost_day: {
						title: "记账日期",
						key: "stock_out_per_taking_cost_day",
						style: {
							flex: 1,
						},
					},
					// note: {
					// 	title: "备注",
					// 	key: "note",
					// 	style: {
					// 		width: "60upx",
					// 	},
					// },
				},
				tableHd: [],
				bagList: []
			}
		},
		methods: {
			delItem(data) {
				this.list = this.list.filter(v => v.id != data.id);
			},
			updataItem(data){
				// #ifdef MP-WEIXIN
				let index = this.list.findIndex(v=>v.id == data.id);
				this.list[index] = data;
				// #endif
			},
			save() {
				if (this.list.length == 0) {
					uni.$u.toast("无数据");
					return;
				}
				let stock_taking_record_detail_list = [];
				this.list.forEach(v => {
					stock_taking_record_detail_list.push({
						id: v.id,
						material_id: v.material_id,
						main_qty: v.main_qty,
						main_unit_id: v.main_unit_id,
						stock_qty_before_taking: v.stock_qty_before_taking,
						status: v.status,
						stock_out_per_taking_cost_day: v.stock_out_per_taking_cost_day,
					})
				})
				// console.log(stock_taking_record_detail_list);
				// return;
				
				uni.showLoading({
					title: "加载中",
				});
				stock_taking_record_handle_diff({
						stock_taking_record_id: this.id,
						stock_taking_record_detail_list: stock_taking_record_detail_list
					}).then((res) => {
						uni.$u.toast("操作成功");
						setTimeout(() => {
							uni.$emit('refresh_inventory');
							if (this.id == 0) {
								uni.$u.route({
									type: 'navigateBack',
									delta: 2
								})
							} else {
								uni.navigateBack();
							}
						}, 2000);
					})
					.catch(() => {})
					.finally(() => {
						uni.hideLoading();
						uni.stopPullDownRefresh();
					});
			},
			getData() {
				uni.showLoading({
					title: "加载中",
					mask: true,
				});
				this.loadingStatus = 'loading';
				one_stock_taking_record_detail({
					stock_taking_record_id: this.id
				}).then((res) => {

					let list = [];
					(res.result || []).forEach((v) => {
						list.push({
							...v,
							stock_out_per_taking_cost_day: '-1',
							_material_id: v.material_id[1],
							_main_unit_id: v.main_unit_id[1],
							material_id: v.material_id[0],
							main_unit_id: v.main_unit_id[0],
						});
					});
					this.list = list;
					this.loadingStatus = 'end';
				}).finally(() => {
					this.loadingStatus = 'end';
					uni.hideLoading();
					uni.stopPullDownRefresh();
				});
			},
			updataList(data) {
				this.list = JSON.parse(JSON.stringify(this.bagList));
			},
		},
		onLoad(d) {
			// d.bagList = JSON.stringify([
			//     {
			//         "id": 336010,
			//         "material_id": 371416,
			//         "_material_id": "整猪蹄",
			//         "main_qty": 1,
			//         "stock_qty_before_taking": "",
			//         "status": "t2_stock_out",
			//         "stock_out_per_taking_cost_day": "-1",
			// 		"_main_unit_id":'斤',
			// 		"main_unit_id":9
			//     },
			//     {
			//         "id": 336024,
			//         "material_id": 371620,
			//         "_material_id": "大白菜一",
			//         "main_qty": 1,
			//         "stock_qty_before_taking": "",
			//         "status": "t2_stock_out",
			//         "stock_out_per_taking_cost_day": "-1",
			// 		"_main_unit_id":'斤',
			// 		"main_unit_id":9
			//     }
			// ]);
			this.id = Number(d.id) || 0;
			this.date = d.date || '新增';
			if (d.bagList) {
				this.bagList = JSON.parse(d.bagList);
				this.updataList();
			}
			if (this.id) {
				this.getData();
			}

			let tableHd = [];
			for (let key in this.tableConfig) {
				// if(!(this.id && key == 'stock_out_per_taking_cost_day')){

				// }
				tableHd.push(this.tableConfig[key]);
			}
			this.tableHd = tableHd;

			try {
				this.role = this.$store.getters.get_role;
				this.userInfo = this.$store.getters.get_userInfo;
			} catch (e) {
				uni.reLaunch({
					url: '/pages/login/login'
				});
			}
		},
		onReady() {
			let navigationBarTitle = '盘点单【' + this.date + '】';
			uni.setNavigationBarTitle({
				title: navigationBarTitle
			});
		},
		onPullDownRefresh() {
			this.getData();
		}
	}
</script>

<style lang="scss" scoped>
	/deep/.col-item {
		padding: 20upx 10upx;
		text-align: center;
	}

	/deep/.input_border_bottom {
		line-height: 72upx;
		height: 72upx;
		font-size: 28upx;
		border-bottom: 1px solid #cccccc;
	}

	/deep/.input_border_bottom_red {
		color: #D6251F;
		border-bottom: 1px solid #D6251F;
	}

	.save-btn {
		height: 90upx;
		line-height: 90upx;
		width: 300upx;
		text-align: center;
		background-color: #675f91;
		color: #ffffff;
	}

	.save-btn.disabled {
		opacity: 0.5;
	}

	.blank90 {
		height: 90upx;
	}
</style>